// 平滑折线图组件
import BaseLineChartComponent from "./base-line-chart.js";

class SmoothedLineChart extends BaseLineChartComponent {
    constructor() {
        super();
    }

    // 重写默认配置
    getDefaultConfig() {
        const config = super.getDefaultConfig();

        // 平滑折线图特定配置
        config.titleAttrs = [
            ...config.titleAttrs,
            ['title-text_text', '平滑折线图'],
            ['title-subtext_text', '平滑曲线展示']
        ];

        config.seriesAttrs = [
            ...config.seriesAttrs,
            ['series-smooth_radio', true],  // 开启平滑效果
            ['series-areastyle-show_radio', false]  // 关闭面积显示
        ];

        return config;
    }

    // 重写默认数据
    getDefaultData() {
        return [
            {
                "温度": [
                    { "name": "1时", "value": 18 },
                    { "name": "5时", "value": 16 },
                    { "name": "9时", "value": 20 },
                    { "name": "13时", "value": 25 },
                    { "name": "17时", "value": 23 },
                    { "name": "21时", "value": 20 }
                ]
            },
            {
                "湿度": [
                    { "name": "1时", "value": 65 },
                    { "name": "5时", "value": 72 },
                    { "name": "9时", "value": 68 },
                    { "name": "13时", "value": 55 },
                    { "name": "17时", "value": 60 },
                    { "name": "21时", "value": 66 }
                ]
            }
        ];
    }

    //重写generateSeries方法，调整data属性值处理
    generateSeries(dataDemo, seriesConfig, lineConfig  ) {
        const defaultColors = super.getDefaultGradients();
        const seriesList = [];

        // 遍历数据生成系列配置（完整实现父类逻辑并修改data处理）
        dataDemo.forEach((item, index) => {
            // 动态获取数据键名（如"温度"、"湿度"）
            const seriesKey = Object.keys(item)[0];
            if (!seriesKey) {
                console.warn('数据项缺少有效键名', item);
                return;
            }

            // 获取当前系列的原始数据
            const seriesData = item[seriesKey];
            if (!Array.isArray(seriesData)) {
                console.warn(`系列"${seriesKey}"的数据不是数组`, seriesData);
                return;
            }

            // 重点修改：处理data属性值，只提取value组成数组
            // 并可根据需求添加数据转换逻辑（如单位转换、格式化等）
            const processedData = seriesData.map(dataItem => {
                // 基础值处理
                let value = dataItem.value ?? 0;

                // 示例：可添加数据转换逻辑（根据需要修改）
                // if (seriesKey === '温度' && typeof value === 'number') {
                //     value = value.toFixed(1); // 温度保留一位小数
                // }

                return value; // 最终返回处理后的值
            });

            // 生成系列配置
            const series = {
                name: seriesKey,
                type: 'line',
                data: processedData, // 使用处理后的value数组
                smooth: seriesConfig.smooth ?? true, // 确保平滑效果
                symbol: seriesConfig.symbol || 'circle',
                symbolSize: parseInt(seriesConfig.symbolSize) || 6,
                lineStyle: {
                    width: parseInt(seriesConfig.lineWidth) || 2,
                    color: lineConfig.linestyleColor || defaultColors[index % defaultColors.length]
                },
                ...(lineConfig.areastyleShow ? {
                    areaStyle: {
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            { offset: 0, color: seriesConfig.areastyleColorStart || defaultColors[0].start },
                            { offset: 1, color: seriesConfig.areastyleColorEnd|| defaultColors[0].end }
                        ]),
                        opacity: seriesConfig.fillOpacity || 0.7
                    }
                } : {}),
                itemStyle: {
                    color: seriesConfig.lineColor || defaultColors[index % defaultColors.length],
                    borderColor: '#fff',
                    borderWidth: 2
                },
                // 动画配置（添加容错处理）
                animationDuration: (this.bumpConfig && typeof this.bumpConfig.transitionDuration !== 'undefined')
                    ? this.bumpConfig.transitionDuration
                    : 1000
            };

            seriesList.push(series);
        });

        return seriesList;
    }
}

// 定义自定义元素
customElements.define('smoothed-line-chart', SmoothedLineChart);
